<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>
<%@ taglib prefix="spring" uri="http://www.springframework.org/tags"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html lang="ko">
<head>
	<title>페이지뷰</title>
	<script src="/js/jquery.js" type="text/javascript"></script>
	<script type="text/javascript">
	function formatDate_yy(date)
	{
		return (date.getFullYear() + "");
	}
	function formatDate_yymm(date)
	{
		var mymonth = date.getMonth() + 1;
		return (date.getFullYear() + "-" + ((mymonth < 10) ? "0" : "") + mymonth);
	}

	var d = new Date();
	var currentDate_yy = formatDate_yy(d);
	var currentDate_yymm = formatDate_yymm(d);

	// 이전년도
	function SetPrevYear()
	{
		d = new Date((d.getFullYear() - 1), 1, 1);
		setMonthVisit( formatDate_yy(d) );
	}
	// 다음년도
	function SetNextYear()
	{
		d = new Date((d.getFullYear() + 1), 1, 1);
		setMonthVisit( formatDate_yy(d) );
	}
	
	// 이전달
	function SetPrevMonth()
	{
		d = new Date(d.getFullYear(), d.getMonth() - 1, 1);
		setDayVisit( formatDate_yymm(d) );
	}
	// 다음달
	function SetNextMonth()
	{
		d = new Date(d.getFullYear(), d.getMonth() + 1, 1);
		setDayVisit( formatDate_yymm(d) );
	}
	
	function setTotalVisit()
	{
		$.ajax(
		{
			type : "GET"
			, async : true
			, url : "/common/stats_total.do"
			, dataType : "html"
			, timeout : 30000
			, cache : false  //true, false
			, data : "site=home"
			, contentType: "application/x-www-form-urlencoded; charset=UTF-8"
			, error : function(request, status, error) {
				alert("code : " + request.status + "\r\nmessage : " + request.reponseText);
			}
			, success : function(response, status, request) {
				$('#totalVisit').find("table").remove().end().append(response);
			}
		});
	}

	function setDayVisit(days)
	{
		setTab(1);
		$.ajax(
		{
			type : "GET"
			, async : true
			, url : "/common/stats_day.do"
			, dataType : "html"
			, timeout : 30000
			, cache : false  //true, false
			, data : "site=home&tableName=nm_pageview&input_date="+days
			, contentType: "application/x-www-form-urlencoded; charset=UTF-8"
			, error : function(request, status, error) {
				alert("code : " + request.status + "\r\nmessage : " + request.reponseText);
			}
			, success : function(response, status, request) {
				$('#detailData').find("div").remove();
				$('#detailData').find("table").remove();
				$('#detailData').end();
				$('#detailData').append(response);
			}
		});
	}
	function setMonthVisit(days)
	{
		setTab(2);
		$.ajax(
		{
			type : "GET"
			, async : true
			, url : "/common/stats_month.do"
			, dataType : "html"
			, timeout : 30000
			, cache : false  //true, false
			, data : "site=home&tableName=nm_pageview&input_date="+days
			, contentType: "application/x-www-form-urlencoded; charset=UTF-8"
			, error : function(request, status, error) {
				alert("code : " + request.status + "\r\nmessage : " + request.reponseText);
			}
			, success : function(response, status, request) {
				$('#detailData').find("div").remove();
				$('#detailData').find("table").remove();
				$('#detailData').end();
				$('#detailData').append(response);
			}
		});
	}
	function setYearVisit()
	{
		setTab(3);
		$.ajax(
		{
			type : "GET"
			, async : true
			, url : "/common/stats_year.do"
			, dataType : "html"
			, timeout : 30000
			, cache : false  //true, false
			, data : "site=home&tableName=nm_pageview"
			, contentType: "application/x-www-form-urlencoded; charset=UTF-8"
			, error : function(request, status, error) {
				alert("code : " + request.status + "\r\nmessage : " + request.reponseText);
			}
			, success : function(response, status, request) {
				$('#detailData').find("div").remove();
				$('#detailData').find("table").remove();
				$('#detailData').end();
				$('#detailData').append(response);
			}
		});
	}
	function setTab(no)
	{
		for(var i=1; i<4; i++)
		{
			document.getElementById("slist"+i).className = "off";			
		}
		document.getElementById("slist"+no).className = "on";
	}
	</script>
	<style>
	#tab			{ margin-top:10px; margin-bottom:10px; border-bottom:1px solid #ccc; position:relative; height:29px; }
	#tab ul		{ margin:0; padding:0; position:absolute; top:0; left:0; }
	#tab ul li
	{
		list-style:none;
		float:left; width:120px; height:25px; text-align:center;
		border:1px solid #ccc; border-bottom:none; margin-top:3px;
	}
	#tab ul li.on	{ background-color:white; padding:3px 0 5px 0; height:21px; margin-top:0; }
	#tab ul li.off	{ background-color:#eee; }
	#tab ul li a		{ display:block; height:100%; padding-top:6px; }
	</style>
</head>

<body>
	<!-- 본문 영역 -->
	<form name="excelDownloadFrm" method="post" action="/stats/excel_download.do" >
	<input type="hidden" name="site" />
	<input type="hidden" name="tableName" />
	<input type="hidden" name="input_date" />
	<input type="hidden" name="title" />	
	</form>
	<div id="contents">
		<!-- 제목 및 Location 영역 -->
		<div id="location">
			<h3>페이지뷰</h3>
			<div>홈 &gt; 관리메뉴 &gt; 통계 &gt;<strong>페이지뷰</strong></div>
		</div>

		<!-- 본문 내용 -->
		<div id="content">
			<div id="totalVisit">
				<script>setTotalVisit();</script>
			</div>
			<div id="tab">
				<ul>
					<li class="on" id="slist1"><a href="#" onclick="setDayVisit(currentDate_yymm); return false;">일별 페이지뷰</a></li>
					<li class="off" id="slist2"><a href="#" onclick="setMonthVisit(currentDate_yy); return false;">월별 페이지뷰</a></li>
					<li class="off" id="slist3"><a href="#" onclick="setYearVisit(); return false;">년도별 페이지뷰</a></li>
				</ul>
			</div>
			<div id="detailData">
				<script>setDayVisit(currentDate_yymm);</script>
			</div>
		</div>
	</div>
</body>
</html>